<template>
	<view class="wrap">
		<view class="main">
			<g-item>
				<template v-slot:left>
					<view class="item-left">优惠券金额</view>
				</template>
				<template v-slot:right>
					<view class="item-right" style="color: #FF7733;">￥{{couponInfo.price || 0}}</view>
				</template>
			</g-item>
			<g-item>
				<template v-slot:left>
					<view class="item-left">适用商家</view>
				</template>
				<template v-slot:right>
					<view class="item-right">{{couponInfo.createBy}}</view>
				</template>
			</g-item>
			<g-item>
				<template v-slot:left>
					<view class="item-left">使用条件</view>
				</template>
				<template v-slot:right>
					<view class="item-right">{{goodsInfo.productName}}</view>
				</template>
			</g-item>
			<g-item>
				<template v-slot:left>
					<view class="item-left">有效期至</view>
				</template>
				<template v-slot:right>
					<view class="item-right">{{couponInfo.effectiveDate}}</view>
				</template>
			</g-item>
		</view>
		<view class="btn app_flex-aicjcc" @click="chargeoffCoupon">
			确认核销
			<!-- <g-btn title="确认核销"></g-btn> -->
		</view>
	</view>
</template>

<script>
	let btnLocked = false
	export default {
		data() {
			return {
				couponRecordId: '',
				couponInfo: {},
				goodsInfo: {}
			}
		},
		onLoad(options) {
			console.log(options);
			this.couponRecordId = options.scanResult || ''
			this.getCouponInfo()
		},
		methods: {
			getCouponInfo() {
				this.$g_api.couponCouponInfo({
					recordId: this.couponRecordId
				}).then(({
					data
				}) => {
					this.couponInfo = data.coupon
					this.getGoodsInfo(data.coupon.skuId)
					console.log(data);
				})
			},
			getGoodsInfo(productId) {
				// /api/product/detailProduct
				this.$g_api.productDetailProduct({
					productId
				}).then(({
					data
				}) => {
					this.goodsInfo = data
				})
			},
			chargeoffCoupon() {
				if (!this.couponRecordId) {
					uni.showToast({
						title: '核销失败，优惠券ID缺失',
						icon: 'none'
					})
					return
				}
				if (btnLocked) return
				btnLocked = true
				setTimeout(() => {
					btnLocked = false
				}, 800)
				uni.showLoading({
					title: '核销中',
					mask: true
				})
				this.$g_api.couponOfflineCancelCoupon({
					couponRecordId: this.couponRecordId
				}).then(({
					data
				}) => {
					uni.hideLoading()
					uni.showToast({
						title: '核销成功'
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 800)
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.main {
		margin-top: 20rpx;
	}

	.item-left {}

	.item-right {}

	.btn {
		margin: 150rpx auto 0;
		width: 690rpx;
		height: 90rpx;
		background: linear-gradient(90deg, #6699FF, #3377FF);
		box-shadow: 0rpx 6rpx 14rpx 0rpx rgba(76, 136, 255, 0.5);
		border-radius: 45rpx;
		font-size: 32rpx;
		font-family: FZLanTingHeiS-R-GB;
		font-weight: 400;
		color: #FFFFFF;
	}
</style>